<template>
<!-- 	<view class="wanlpage-notice" :style="[pageData.style]">
		<view @tap="$wanlshop.on(pageData.data[0].link)">
			<text class="wlIcon wlIcon-notice margin-right-xs" v-if="pageData.params.show"></text>
			<text>{{pageData.data[0].content}}</text>
		</view>
	</view> -->
	
<view>
	<view class="notice-box" @click="openModal(pageData.data[0].content)">
		<view class="flex align-center">
			<view class="flex align-center">
				<text class="notice-title1">资</text>
				<text class="notice-title2">讯</text>
			</view>
			
			<view class="notice-content text-cut">{{pageData.data[0].content}}</view>
		</view>
		
		<!-- <view class="wlIcon-fanhui2 colorgrey"></view> -->
	</view>
	
	<wanl-modal custom :show="showModal" width="93%" padding="30rpx">
		<view class="modal-body">
			<view class="flex align-center justify-center">
				<view class="modal-title">资讯</view>
				<image src="/static/images/close.png" class="close-image" @click="closeModel"></image>
			</view>
			
			<scroll-view class="scroll-view" scroll-Y="true">
				<view class="modal-content">
					 {{content}}
				</view>
			</scroll-view>
		</view>
	</wanl-modal>
</view>	
	
</template>
<script>
	export default {
		name: "WanlPageNotice",
		props: {
			pageData: {
				type: Object,
				default: function() {
					return {
						name: '公告栏',
						type: 'notice',
						params: [],
						style: [],
						data: []
					}
				}
			}
		},
		data() {
			return {
				showModal: false,
				content:'',
			}
		},
		methods:{
			openModal(content){
				this.showModal = true;
				this.content = content;
			},
			closeModel(){
				console.log("go closeModel");
				this.showModal = false;
			}
		}
	}
</script>



<style scoped  lang="scss">
.notice-box{
	width: 702rpx;
	height: 72rpx;
	background: #FFFFFF;
	border-radius: 20rpx;
	display:flex;
	justify-content: space-between;
	padding: 0rpx 34rpx;
	align-items: center;
	margin: 39rpx 24rpx 20rpx 24rpx;
}

.notice-title1{
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 700;
	color: #333333;
}

.notice-title2{
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 700;
	color: #366BEB;
}

.notice-content{
	font-size: 26rpx;
	font-family: PingFang SC;
	font-weight: 300;
	color: #999999;
	margin-left: 21rpx;
	width: 550rpx;
}	

.modal-body{
	height: 738rpx;
	background-color: #FFFFFF;
	border-radius: 20rpx;
}

.modal-box{
}

.modal-title{
	font-size: 32rrpx;
	font-family: PingFang SC;
	font-weight: 700;
	color: #292929;
}

.close-image{
	width: 42rpx;
	height: 42rpx;
	position: absolute;
	top: 30rpx;
	right: 28rpx;
}

.modal-content{
	margin-top: 40rpx;
}

</style>
